@import "base";
@import "properties";
@import "_attention/wobble";
@import "_bouncing-entrances/bounceIn";
@import "_bouncing-exits/bounceOut";
@import "_bouncing-exits/bounceOutUp";
@import "_bouncing-entrances/bounceInUp";
@import "_bouncing-entrances/bounceInRight";
@import "_bouncing-entrances/bounceInLeft";
@import "_fading-entrances/fadeIn";
@import "_fading-entrances/fadeInRight";
@import "_fading-entrances/fadeInLeft";
@import "_fading-exits/fadeOutRight";
@import "_fading-exits/fadeOutLeft";
@import "_fading-entrances/fadeInUp";
@import "_fading-exits/fadeOutUp";

html, body {
	@extend .Ht100perc;
}

body {
	 @extend .fontFam;
	-webkit-font-smoothing: antialiased;
	 font-size:$font-size;
	 background-color:#FAF8F8 !important;
}

h1 {
	font-size:22px;
	line-height:30px;
	@include bp(portrait320){
		text-align:center;
		font-size:$h-size / 2;
	}
}

h2 {
	font-size:$h-size / 2;
	@include bp(portrait768) {
		font-size:$h-size;
	}
}

h3 {
	font-size:18px;
}

img {
}

.fl-main-container {
	@extend .Ht100perc;
}

.fl-user-wrapper {
	@extend .wH100perc;
	@include pos-rel(50px, auto, auto, auto);
	min-height:100%;
}

*:focus {
    outline: 0;
}

/* HEADER CSS */

.fl-user-header-wrapper {
	@extend .wH100perc;
	position:fixed;
	height:50px;
	z-index:100000;
	@include bp(portrait320){

	}
}

.fl-user-company-avatar-wrapper {
	@extend .avatar-wrapper;
	@extend .fL;	
}

.fl-user-onlineuser-avatar-wrapper {
	@extend .avatar-wrapper;
	@extend .fR;
	position:relative;
}


.fl-user-avatar-company-wrapper {
	@extend .fL;
	@extend .borderR3;
	width:36px;
	height:36px;
	padding:2px;
	@include bp(portrait768){
		display:none;
	}

	img {
		@extend .borderR3;
	}
}

.fl-user-avatar-wrapper {
	@extend .fR;
	@extend .cursorPointer;	
	width:36px;
	height:36px;
	padding:2px;
}


span.fl-user-companyname {	
	@extend .avatar-profile-properties;
	@include bp(portrait768){
		display:none;
	}
}

span.fl-user-name {
	@extend .avatar-profile-properties;
}

.fl-user-header-wrapper a {
	@extend .colorfff;
}


.fl-header-option {
	@include pos-abs(50px, 0px, auto, auto);
	background-color:#3A4B55;
	z-index: 99999;
	font-size: 12px;
	line-height: 25px;
	color:#6e6e6e;
	min-width: 160px;
	display:none;
	border:1px solid #49565D;
	border-top:0;
}

.fl-header-option  {
	
	> ul {

		> li {
			
			@extend .colorfff;
			@extend .trans-duration3;
  			@extend .trans-timing;
			padding:5px;
			border-bottom: 1px solid #29373D;

			> a {
				@extend .colorfff;
				display:block;
			}

			&:hover {
			@extend .trans-duration3;
 			@extend .trans-timing;	
			background-color:#2C3A42;
		}
	}

		 

	}
	
}

.fl-header-option li:last-child{
	border-bottom:0;
}
.fl-header-option li a i {
	@extend .colorfff;	
}

.fl-header-option li:nth-child(2) a i {
	position:relative;
}
.fl-header-option ul li ul li {
	display:inline-block;
}


/* END HEADER CSS */

/* MAIN CONTENT CSS */

.fl-maincontainer {
	@extend .Ht100perc;
}
.fl-content {
	@extend .fR;
	@extend .Ht100perc;
	@extend .bgcolorfff;
	@extend .boxSizingBB;
	@include margin(auto, auto, 50px, auto);
	position:relative;
	width:83%;
	padding:10px;
	background-color:#FAF8F8 !important;
	@include bp(portrait768){
		width:100%;
	} 
}

.fl-main-content-wrapper {
	@include pos-rel(auto, auto, auto, 50px);
	opacity:0;
}

/* END MAIN CONTENT CSS */
.clearfix {
	clear:both;
}

/* NAVIGATION CSS */

.current {
	@extend .colorfff;
	background-color:#8D8D8D;
}

.fl-user-navigation-wrapper {
	@extend .fL;
	@extend .Ht100perc;
	@include pos-abs(0px, auto, 0px, 0px);
	width:17%;
	background-color:#e0e0e0;
    @include bp(portrait768){
    	z-index:99999;
    	width: 25%;
    	display:none;
    }
    @include bp(landscape568){
    	width: 50%;
    	z-index:2;
    }
}
.fl-user-navigation-wrapper:before{
	@include pos-fix(0px, auto, 0px, auto);
	content: "";
	display: block;
	width:17%;
	z-index: -1;
	background-color:#e0e0e0;
}

.diplay{
  display: none;
}


#fl-showmenu {
	display:none;
	 @include bp(portrait768){
	 	position:relative;
		padding: 13px;
		max-width: 166px;
		color:#ffffff;
		cursor:pointer;
		display:block;
		z-index:99999;
    }
}

.fl-toggle-menu {
	width: 21px;
	height: 3px;
	background-color: #fff;
	margin-bottom:2px;
}
.fl-toggle-menu:last-child{
	margin-bottom:0px;
}

.mainmenu {

	 @include bp(portrait768){ 
	 	margin-top:0;
	 }
}

.fl-user-navigation-wrapper {

	> ul {
		
		
		> li {
			position:relative;
			font-size:13px;	
			border-bottom: 1px solid #d3d3d3;

			@include bp(landscape1024) {
				font-size:12px;
			}

			> a {
				color:#6e6e6e;
				text-decoration:none;
				display:block;
				padding: 13px 0px 13px 13px;

				&:hover {
					@extend .colorfff;
				}
			}

		&:hover {	
					@extend .trans-duration5;
					background-color:#8D8D8D;

			}

			&:hover a {	
				color:#ffffff;	
									
			}	

		}
	}
}

.fl-user-navigation-wrapper ul li:hover ul li a {
	@extend .colorfff;
}



.mainmenu li .counter {
	top:10px;
}
.counter {
	background-color:$theme-sign-color;
	@extend .colorfff;
	@include border-radius(2px);
	@include pos-abs(auto, 0px, auto, auto);
	line-height: 10px;
	padding:5px;
	margin-right:5px;
}

.fl-counter-dashboard {
	@extend .fR;
	position:static;
}


.fl-user-navigation-wrapper ul ul li {
	
	border-top: 1px solid #ACACAC;
}

.fl-user-navigation-wrapper ul ul li:last-child {
	border-bottom: 1px solid #ACACAC;
}

.fl-user-navigation-wrapper ul ul li a:hover {
	@extend .colorfff;
	@extend .trans-duration5;
}

.fl-user-navigation-wrapper ul ul li a {
	@extend .textTruncate;
	@extend .fontWeightB;
	color:#6e6e6e;
	text-decoration:none;
	display:block;
	padding:13px 30px;
}

.fl-user-navigation-wrapper ul ul li:hover i {
	color:#ffffff;
}

.fl-user-navigation-wrapper ul ul ul li a {
	@extend .fontWeightN;
	@extend .textTruncate;
	@include padding(13px, 5px, 13px, 47px);
	font-size:11px;
	color:#6e6e6e;
	text-decoration:none;
	display:block;

	i {
		font-size:10px;
	}
}

.fl-user-navigation-wrapper ul ul ul li:last-child {
	border-bottom:none;
}

.main-submenu {
	display:none;
}

.mainmenu li:hover i {
	color:#ffffff;
}
.mainmenu li a:hover {
	color:#ffffff;
}

/* END NAVIGATION CSS */



/*HOME CONTENT CSS*/

.fl-table-wrapper {
	//@extend .bgcolorfff;
	clear:both;
}

.fl-table-wrapper table tr td {
	padding:10px;
	font-size:12px;
}

.dataTable {

}

.fl-table-wrapper table tr{
	border-bottom: 1px solid #d6d6d6;
}

.fl-table-wrapper table tr:hover, .fl-list-of-app-record-wrapper table tr:hover {
	@extend .trans-duration3;
	background-color:#ededed;
}

.fl-privacy-setting-wrapper .fl-table-wrapper table tr:hover {
	border-left:none;
}

.fl-header-tbl-wrapper tr:hover:nth-child(1), .fl-search-cont tr:hover:nth-child(1) {
	border-left:none;

}

.dataTables_paginate  {
	
}
.fl-datatable-wrapper {
	min-height:200px;
}

.fl-table-ellip {
	@extend .wH100perc;
	@extend .textTruncate;
	margin-left:7px;
	padding: 2px;
}

.fl-table-ellip:first-child{
	margin-left:0px;
}

fl-table-ellip:nth-child(1) {
	width:auto;
}

.dataTable, .dataTable tr td {
	@extend .wH100perc;
	max-width:100%;
	table-layout:fixed;
}



.fl-header-tbl-wrapper{
	background-color:#ededed!important;
}


.dataTable thead tr th:hover {
	border-right: 1px solid #D6D6D6;
}

.fl-list-of-app-record-wrapper .dataTable thead tr th:hover {
	border-right: none;
}

.dataTable thead tr th:nth-child(1){
	border:none!important;
}

.dataTable thead tr th {
}

.fl-header-tbl-wrapper th:first-child {
	border:none;
}

.fl-header-tbl-wrapper th:last-child {
	border:none;
}

.thead {
	@extend .fontWeightB;
	font-family:arial, helvetica, sans-serif;
}

table {
	
}

.fl-search-wrapper {
	@extend .fL;
	position:relative;
	width:479px;
	@include bp(portrait768) {
		position:static;
		top:0;
	}
	@include bp(portrait320){
		width:100%;
	}
}

.fl-search-wrapper input {
	@extend .input-text;
	@extend .fL;
	padding:6px;
}


.fl-sort-wrapper {
	@extend .fR;
	@include bp(portrait768){
		font-size: 9px;
	}
	@include bp(landscape568){
		float:left;
		@include margin(10px, 10px, 0px, 0px);
	}
}

.fl-showing-items-wrapper {
	@extend .fL;
	font-size:$font-size;
}

.fl-tbl-pag-wrapper {
	@extend .fR;
	width: 273px;
}

.paginate.pag1 { /* first page styles */ }

.paginate.pag1 li { 
font-size:11px;
}

.paginate.pag1 li a {
  @extend .fL;
  display: block;
  color: #717171;
  background: #e9e9e9;
  text-decoration: none;
  padding: 5px 7px;
  margin-right: 6px;
  border-radius: 3px;
  border: solid 1px #c0c0c0;
  box-shadow: inset 0px 1px 0px rgba(255,255,255, .7), 0px 1px 3px rgba(0,0,0, .1);
  text-shadow: 1px 1px 0px rgba(255,255,255, 0.7);
}
.paginate.pag1 li a:hover {
  background: #eee;
  color: #555;
}
.paginate.pag1 li a:active {
  -webkit-box-shadow: inset -1px 2px 5px rgba(0,0,0,0.25);
  -moz-box-shadow: inset -1px 2px 5px rgba(0,0,0,0.25);
  box-shadow: inset -1px 2px 5px rgba(0,0,0,0.25);
}

.paginate.pag1 li.single, .paginate.pag1 li.current {
  @extend .fL;
  @include border-radius(2px);
  display: block;
  border: solid 1px #c0c0c0;
  padding: 5px 7px;
  margin-right: 6px;
  color: #444;
}

.fl-main-wrapper {
	@extend .Ht100perc;
	@extend .marginAuto;
	max-width: 960px;
	line-height:$line-height;
}


.fl-widget-head {
	border-bottom: 2px solid #29373D;
	height:25px;
	background-color:#2C3A42;
	padding:5px;
}

.widget-icon-wrapper {
	position:relative;
}

.widget-icon-wrapper .company-events {
	@include pos-rel(-9px, auto, auto, -9px);
	background-position: 1px -292px!important;
	width:28px;
}

.widget-icon-wrapper .my-requests {
	@include pos-rel(-9px, auto, auto, -9px);
	background-position: 1px -225px!important;
	width:28px;
}

.widget-icon-wrapper .starred{
	@include pos-rel(-9px, auto, auto, -9px);
	background-position: 1px -257px!important;
	width:32px;
}

.widget-icon-wrapper .reports{
	@include pos-rel(-9px, auto, auto, -9px);
	background-position: 1px -381px!important;
	width:32px;
}

.widget-icon-wrapper .profile{
	@include pos-rel(-9px, auto, auto, -9px);
	background-position: 0px -33px!important;
	width:32px;
}

.widget-icon-wrapper .widget-title .counter {
	@include margin(2px, 0px, 0px, 0px);
}

.widget-title {
	@include pos-rel(6px, auto, auto, auto);
	@extend .colorfff;
}

.fl-widget-wrapper{
	@extend .wH100perc;
	@extend .boxSizingBB;
	@include border-radius(2px);
	@include border-top-right-radius(0px);
	@include border-top-left-radius(0px);
	border: 1px solid #d6d6d6;
	border-bottom: 3px solid #d6d6d6;
	background-color:#fafafa;
	border-top:none;
	height:200px;
	overflow: hidden;
	position: absolute;
	padding:0px 10px;

	 @include bp(landscape1024) {
	 	width:100%;
	 }
	  @include bp(portrait768) {
	 	width:100%;
	 }
}

.fl-online-user-wrapper {
	@extend .boxSizingBB;
	@include border-radius(2px);
	@include border-top-right-radius(0px);
	@include border-top-left-radius(0px);
	border: 1px solid #d6d6d6;
	border-bottom: 3px solid #d6d6d6;
	border-top:none;
	padding:10px;
}

.fl-online-user-wrapper .fl-widget-content .online-users-container .avatar {
	margin:5px;
} 


.fl-online-user-wrapper .fl-widget-content {
	margin:0px!important;	
}

.ps-scrollbar-x {
	opacity:0!important;
	display:none!important;
}

.fl-widget-content {
	width:99%;
	height:auto;
	@include margin(3%, 0%);
	line-height:$line-height;
	@include bp(landscape1024){
		width:99.5%;
	}
}

.fl-avatar {
	@extend .fL;
	@include border-radius(2px);
	width:36px;
	height:36px;
	background-color:#d6d6d6;
	padding:2px;
	margin-right:5px;

}

.fl-avatar, .avatar, .fl-user-avatar-wrapper, .fl-user-avatar-wrapper img {
	@include vendor-prefix('border-radius', '100%');
}

.fl-widget-cpnyevnts-content-wrapper{
	@extend .Ht100perc;
	@extend .bgcolorfff;
	@include border-radius(2px);
	width: auto;
	border: 1px solid #d6d6d6;
	padding:5px;
	margin-left: 47px;
	word-break:break-word;
	@include bp(landscape1024) {
	
	}

	@include bp(portrait768) {
		
	}	
	
	@include bp(landscape568) {
		width: 87.9%;
	}

	@include bp(portrait320) {
		width: 78.9%;
	}

}


.fl-widget-starred-content-wrapper {
	
	& .time  {
	@extend .fR;	
	font-size:11px;
	color:#222222;
	}

}


.fl-widget-my-requests-content-wrapper, .fl-widget-starred-content-wrapper{
	@extend .Ht100perc;
	@extend .bgcolorfff;
	@include border-radius(2px);
	width: auto;
	margin-left: 47px;
	border: 1px solid #d6d6d6;
	padding:5px;
	@include bp(landscape1024) {
		width:92.5%;
	}

	@include bp(portrait768) {
		width:91.9%;
	}	
	
	@include bp(landscape568) {
		width: 87.9%;
	}

	@include bp(portrait320) {
		width: 78.9%;
	}
}

.request-status {
	color:#00be04;
}

.request-time {
	@extend .taC;
	@extend .fR;
	@include border-bottom-left-radius(2px);
	@include border-bottom-right-radius(2px);
	@include pos-rel(-1px, auto, auto, auto);
	font-size:11px;
	color:#222222;
	width: 38.6%;
	background-color: #d6d6d6;
	@include bp(landscape1024){
	 	width:94%;
	 }
	@include bp(portrait768){
	 	width:93.6%;
	 }
	@include bp(landscape568){
	 	width:90.3%;
	 }
	 @include bp(portrait320){
	 	width:83.5%;
	 }

}

.fl-delete {
	@extend .fR;
	@extend .cursorPointer;
	color:#222222;
	opacity:0;
	@include bp(landscape568){
		@include margin(4px, 0px, 0px, 6px);
	}
}

.fl-report-wrapper {
	@extend .fR;
	width: 65.6%;
	margin-top:10px;
	@include bp(landscape1024) {
		float:none;
		margin-top:0;
	}
}

.fl-report-wrapper-content {
	@include border-radius(2px);
	@include border-top-right-radius(0px);
	@include border-top-left-radius(0px);
	border: 1px solid #d6d6d6;
	border-bottom: 3px solid #d6d6d6;
	border-top:none;
	padding:5px;
}

select{
	padding:5px;
}

.fl-save-sort {
	@extend .fR;
	width:169px;
	@include bp(portrait768) {
	}
	@include bp(landscape568){
		margin-top:10px;
		float:left;
	}
}

.fl-search-wrapper form input[type="button"] {
	display:none;
}

/* END HOME CONTENT CSS*/

/* PROFILE CONTENT CSS*/

.large-avatar-wrapper {
	@include border-radius(2px);
	width: 230px;
	height: 230px;
	padding:10px;
	margin: 0;
}

/* END PROFILE CONTENT CSS*/


/* MODULE ICON */

ul.fl-module-icon li {
	@extend .fL;
	@extend .borderR3;
	width: 125px;
	height: 125px;
	margin:18px 7px 5px 0px;
	@include bp(portrait320){
		float:none;
	}
}


/* Caption Style 4 */
.fl-module-icon li {
	-webkit-perspective: 1700px;
	-moz-perspective: 1700px;
	perspective: 1700px;
	-webkit-perspective-origin: 0 50%;
	-moz-perspective-origin: 0 50%;
	perspective-origin: 0 50%;
}

.fl-module-icon li:hover {
	@extend .trans-duration5;
}

.fl-module-icon li .fl-mod-title a {
	@extend .colorfff;
	display:block;
}
.fl-mod-title-hover {
	@extend .trans-duration5;
	background-color:$sidebar-color!important;
	color:#222222!important;

}

.fl-module-icon figure {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.fl-module-icon figure > div {
}

.fl-module-icon figure img {
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
	width:50%;
	height:50%;
}

.no-touch .fl-module-icon figure:hover img,
.fl-module-icon  figure.cs-hover img {
	width:70px;
	height:70px;
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}

.fl-module-icon figcaption {
	@extend .Ht100perc;
	width: 52%;
	opacity: 0;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: rotateY(-90deg);
	-moz-transform: rotateY(-90deg);
	transform: rotateY(-90deg);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
	transition: transform 0.4s, opacity 0.1s 0.3s;
}

.no-touch ul.fl-module-icon figure:hover figcaption,
.fl-module-icon figure.cs-hover figcaption {
	opacity: 1;
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	transform: rotateY(0deg);
	-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
	-moz-transition: -moz-transform 0.4s, opacity 0.1s;
	transition: transform 0.4s, opacity 0.1s;
}

.fl-icon-button {
	position: relative;
	padding:5px;
	word-wrap: break-word;
	text-transform:lowercase;
	height:132px;
}
.grid {
	@extend .taC;
	@extend .marginAuto;
	max-width: 1300px;
}

.grid li {
	@extend .taL;
	@extend .marginAuto;
	display: inline-block;
	width: 440px;
	position: relative;
}

.grid figure {
	@extend .marginAuto;
	position: relative;
	height:95px;
}

.grid figure img {
	@include pos-rel(19px, auto, auto, auto);
	max-width: 100%;
	display: block;
}

.grid figcaption { @include pos-abs(0px, auto, auto, 0px); color: #ed4e6e; }

.grid figcaption h3 {
	@extend .marginAuto;
	@extend .colorfff;
	padding: 0;
	line-height:17px;
	font-size:12px;
}

.grid figcaption span:before {
	content: 'by';
}

.grid figcaption a {
	@extend .taC;
	@extend .colorfff;
	@extend .wH100perc;
	@extend .boxSizingBB;
	@include border-radius(2px);
	@include pos-abs(auto, auto, 50px, auto);
	padding: 5px 10px;
	display: inline-block;
	text-decoration:none;	
}

/* Individual Caption Styles */

.fl-mod-title {
	@extend .boxSizingBB;
	@extend .colorfff;
	@extend .textTruncate;
	line-height:19px;
	padding:5px;
	font-size:12px;
	text-transform:lowercase;
	height:30px;
	border-bottom: 2px solid #d6d6d6;
}	

.fl-module-category-wrapper {
	@extend .Ht100perc;
	position: relative;
	overflow: hidden;
}

.fl-module-icon {
	@extend .Ht100perc;
}

/* MODULE ICON */

/*ANNOUNCEMENT CSS*/

.fl-starred-color {
	@include pos-abs(15px, auto, auto, 12px);
	font-size:15px; 
	color:yellow;
}

.fl-starred {
	@include pos-abs(0px, 26px, auto, auto);
	height: 45px;  
	width: 40px;  
}

.fl-post-option {
	@extend .boxSizingBB;
	background-color:#F0F0F0;
	padding:10px;
	width:98.5%;
	border-bottom: 2px solid #D6D6D6;
	border-bottom-right-radius:3px;
	border-bottom-left-radius:3px;
	 & .btn-blueBtn {
	 	margin-right:0px;
	 	height:26px !important;
	 }
}

.fl-announcment-wrapper textarea {
	@include margin(0px, 0px, 0px, 0px);
	resize:none;
	width:98.5%;
	height:50px;
	padding:5px;
	border: 1px solid #dfdfdf !important;
	border-bottom:none !important;
	border-top-right-radius:3px;
	border-top-left-radius:3px;
	@include bp(landscape1024){
		width:98.2%;
	}
	@include bp(landscape1024){
		width:98.2%;
	}
	@include bp(portrait320){
		width:95.2%;
	}
}

.fl-announcment-wrapper .mentionContainer .mentionSelectedContainer {
	background:transparent;
}

.fl-input-select {
	@extend .input-select;
}

.fl-input-select, .fl-showPostChoices  {
	@extend .fontFam;
	border: 1px solid #d6d6d6;
}

/* MOZZILLA STYLE ONLY */

@-moz-document url-prefix() { 

.fl-admindashboard-icons-wrapper ul li {
	margin-right:3px !important;
	width:216px;
} 

.fl-command-btn {
	font-size:12px !important;

	i {
		font-size:11px !important;
	}
}

 .fl-input-select, .fl-showPostChoices  {
     padding:5px;
  }
  .fl-edit-info-width {
	width:74.5%!important;
}

.uInfo_211 {
	float:right;
	width:670px!important;
}
.fl-input_position input[type="text"] {
	width: 670px!important;
	}

ul.fl-module-icon li {
	width: 125px;
	height: 125px;
	}
}

/* END MOZZILLA STYLE ONLY */

div.uploader input {
	@extend .cursorPointer;
	@include pos-abs(auto, auto, auto, 0px);
	width: 266px;
	opacity: 0;
	height: 30px;
}

div.uploader span.action {
@extend .fR;
@extend .fontWeightB;
@extend .cursorPointer;
width: 22px;
background: #FFF url(/images/icon/addFiles.png) no-repeat 0 0;
height: 22px;
font-size: 11px;
text-indent: -9999px;
display: inline;
overflow: hidden;
}

input [type="file"] {
	border:1px solid red!important;
}

div.uploader {
	width: 238px;
	position: relative;
	overflow: hidden;
	border: 1px solid #d6d6d6;
	background: #FFF;
	padding: 2px 2px 2px 8px;
	@include bp(portrait320){
		width: 230px;
	}
}

div.uploader span.filename {
	@extend .fL;
	@extend .textTruncate;
	color: #777;
	max-width: 200px;
	font-size: 11px;
	line-height: 22px;
	display: block;
	cursor: default;
}

div.btn_post_holder {
	@extend .fR;
	@include margin(3px, 10px);
}

.post-privacy {
	@extend .fontWeightB;
	@extend .cursorPointer;
	@extend .fR;
	width: auto;
	height: 19px;
	position: relative;
	margin-right: 10px;
	padding: 4px 5px 5px 5px;
	border: 1px ridge transparent;
	color: #A3A3A3 !important;
}
.post-privacy-label-contaner {
	@extend .fL;
	@extend .wH100perc;
}

.post-privacy-arrow {
	@extend .fR;
	margin-top: -3px;
color: rgb(120, 125, 180);
}

.fl-showPostChoices {
	@extend .input-select;
	@extend .fR;
	margin-right:5px;
	@include bp(portrait320){
		float:none;
		margin:0;
		margin-top:10px;
	}
}

input {
	@extend .fontFam;
}

input[type="submit"].fl-btn-right {
	@extend .input-submit;
	@extend .fR;
	@extend .cursorPointer;
	@include bp(portrait320){
		float:none;
	}
}

input[type="submit"] {
	@extend .input-submit;
	@extend .cursorPointer;
	@include bp(portrait320){
		float:none;
	}
}

input[type="button"].fl-btn-right {
	@extend .fR;
}

input[type="button"].fl-btn-left {
	@extend .fL;
}

input[type="button"] {
	@extend .input-submit;
	@extend .cursorPointer;
}

.fl-notes {
	font-size:11px;
	@include bp(portrait768) {
		font-size:9px;
	} 
	@include bp(landscape568) {
		float:left;
		margin-top:10px;
	} 
}

.fl-text {
	@extend .fR;
	height: auto;
	padding: 10px;
	width: 90%;
	margin-bottom:5px;
	@include bp(portrait768){
		width:88.5%;
	}
	@include bp(landscape568){
		width:84.5%;
	}
	@include bp(portrait320){
		width:71.5%;
	}
}

a.message-img {
	@extend .fL;
	@extend .borderR3;
	width:36px;
	height:36px;
	padding:2px;
	display:block;
}

.fl-post-wrapper {
	margin:10px 0px;
}

.fl-timeline-messages:before {
width: 1px;
top: 0;
bottom: 0;
background-color: $sidebar-color;
left: 58px;

@include bp(landscape1024) {
		left: 48px;
	}	
}

.fl-timeline-messages:before{
	@include pos-abs(0px, auto, auto, 52px);
	content: "";
	@include bp(landscape1024) {
			left: 48px;
	}	
}

.fl-post-wrapper:before, .fl-post-wrapper .fl-text:before, .fl-reply-wrapper:before, .fl-reply-wrapper .fl-text:before  {
	@include pos-abs(-9px, auto, auto, 57px);
	content: "";	
}

.fl-post-wrapper:hover:before, .fl-reply-wrapper:hover:before {
background: #fa9e0e;
}

.fl-timeline-messages, .fl-post-wrapper, .fl-reply-wrapper {
	position:relative;
}

.fl-post-wrapper:before {
width: 12px;
height: 12px;
border: 2px solid #fafafa;
border-radius: 100px;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
margin: 20px 0 0 -12px;
background: #ccc;
	@include bp(landscape1024) {
		margin: 20px 0 0 -16px;	
	}
}

.fl-seperator {
	height: 1px;
	background-color:$sidebar-color;
	width: 90%;
	margin: 0 auto;
}


.fl-attribution {
	font-size:11px;
	margin-left:70px;
	margin-bottom:20px;
	@include bp(landscape1024){
		margin-left:58px;
	}
}

.attribution {
	@include bp(portrait320){
		position:relative;
	}
}

.fl-attribution2 {
	@extend .fR;
	font-size:11px;
	@include bp(portrait320){
		float:left;
	}
}

.fl-bold-text {
}
.fl-post-wrapper {
	border-bottom: 1px solid $sidebar-color;
	@include bp(portrait320){
		min-height:120px;
	}
}

.fl-message-body {
	margin-top:30px;
}

.fl-cursor {
	@include pos-rel(auto, auto, auto, 90px);
	font-size:11px;
}

.fl-mentionContainer  {
	@extend .borderR3;
	resize:none;
	width:70%;
	height:50px;
	padding:5px;
	background-color:#ffffff !important;
}

.fl-reply-box {
	display:none;
}

.fl-reply {
	@extend .cursorPointer;
}

.fl-reply-wrapper .fl-message-body .fl-text {
	width:70%;
	@include bp(portrait768){
		width:75%;
	}
	@include bp(portrait320){
		width: 53%;
	}
}

.fl-reply-wrapper .fl-message-body .fl-attribution {
	margin-left:262px;
	@include bp(landscape1024){
		margin-left: 225px;
	}
	@include bp(portrait768){
		margin-left: 164px;
	}
	@include bp(landscape568){
		margin-left: 70px;
	}
}

.fl-reply-wrapper .message-img {
	@include pos-rel(auto, auto, auto, 210px);
	@include bp(landscape1024){
		left:180px;
	}
	@include bp(portrait768){
		left:115px;
	}
	@include bp(landscape568){
		left: 70px;
	}
}

.fl-loadmore-wrapper{
	@extend .fR;
	height: 20px;
	width: 90%;
}

.icon-chevron-down:before {
content: "\f078";
}

.fl-hidden-file-upload {
	@include bp(portrait320){
		left: 58px;
		width: 100px;
	}
}

/* END ANNOUNCEMENT CSS*/

/* COMPANY EVENTS CSS */

.fl-company-events-wrapper textarea {
	resize:none;
	width:98.5%;
	height:50px;
	padding:5px;
	margin: 10px 0px;
	
}

textarea {
	 @extend .fontFam;
}

/* END COMPANY EVENTS CSS */

/* MESSAGE CSS */


.postActions {
	margin: 0 auto;
}

.fl-file-upload {
	margin-left: 36px!important;
	@include bp(landscape1024){
		margin-left: 35px!important;
	}
}

.btn-blueBtn {
	margin-right: 16px;
	@extend .borderR3;
	@extend .trans-duration3;
 	@extend .trans-timing;
 	@extend .fl-button-press;
	@include bp(landscape1024){
		margin-right: 1px;
	}
	@include bp(portrait768){
		margin-right: 13px;
	}
	@include bp(landscape568){
		margin-right:0;
	}
}

.btn-blueBtn:hover {
	@extend .fl-button-press-hover;
}



.fl-left-wrapper {
	@extend .fL;
	width: 27.2%;
	height: auto;
	border: 1px solid #d6d6d6;
	border-bottom: 3px solid #d6d6d6;
	background-color:#fafafa;
	@include bp(portrait768) {
		float:none;
		width: 99.7%;
	}
}

.fl-right-wrapper {
	@extend .Ht100perc;
	@extend .fR;
	width: 71.6%;
	border: 1px solid #d6d6d6;
	border-bottom:3px solid #d6d6d6;
	background-color:#fafafa;
	@include bp(portrait768) {
		float:none;
		width: 99.7%;
		margin-top:10px;
		height:auto;
	}
	@include bp(landscape568){
		height:100%;
	}

}

.fl-left-wrapper-content {
	position:relative;
	overflow:hidden;
	height:366px;
}

.fl-head-title-wrapper{
	@extend .colorfff;
	position:relative;
	margin-bottom:5px;
}

.fl-head-title-wrapper > h2 {
	@include bp(portrait320){

	}
}

.fl-account-settings .fl-head-title-wrapper > h2 {
	@include bp(portrait320){
	display:none;
	}
}


.fl-head-title-wrapper > p, .fl-head-title-wrapper > h2 {
	padding:10px;
	font-size:12px;
}

.fl-head-menu-wrapper {
		@extend .fR;
}

.fl-head-menu li {
	@extend .fL;
	@extend .cursorPointer;
	padding:10px;
}

.fl-head-menu li i {
	@extend .colorfff;
}


.fl-reply-message-wrapper {
	padding:10px;
}

.fl-input-replyMsg {
	resize:none;
	width:95.5%;
	height:50px;
	padding:5px;
	margin: 1px 10px;
	@include bp(portrait320){
		width:90%;
	}
}

#fl-send-msg-form {
	padding:10px;
}

#fl-send-msg-form form input, #fl-send-msg-form form textarea{
	width: 99%;
	height: 22px;
	padding: 3px;
	margin-bottom: 10px;
	@include bp(landscape568){
		width:91%;
	}
	@include bp(portrait320){
		width:83%;
	}
}

#fl-send-msg-form form textarea {
	min-height:260px;	
}

#fl-send-msg-form {
	display:none;
}

#fl-action-option {
	@include pos-abs(34px, 0px, auto, auto);
	display:none;
}

#fl-action-option li {
	@extend .cursorPointer;
	padding:10px;

	> a {
		display:block;
		@extend .colorfff;	
	}

	> i {
		@extend .colorfff;
	} 
}


#fl-action-option li:last-child{
	border-top:none;
	border-bottom:none;
}

#fl-action-option li:nth-child(2){
	border-top:none;
}


.fl-inbox-item .fl-user-avatar-wrapper {
	@extend .fL;
}


.fl-inbox-item {
	border:1px solid #ccc;
	margin:10px;
	padding:5px;
}



.fl-inbox-item-wrapper {
	padding:5px;
}

.fl-inbox-info {
	margin-left:50px;
}
.fl-inbox-item:hover {
	background-color:$sidebar-color;
}

.newMsg {
	@include bp(portrait320){
		float: left!important;
		margin: 10px 0px 0px 35px;
	}
}

/* END MESSAGE CSS*/

/*NOTIFICATIONS CSS*/

.fl-notification-color {
	color:#e13636!important;
	font-size:15px;
}

.notification li {
	padding:10px;
	border-bottom: 1px solid #D6D6D6;
	width:97.9%;

	&:hover {
		background-color:#e0e0e0;
		@extend .trans-duration3;
	}

	@include bp(landscape1024){
		width:96.5%;
	}
}

a { text-decoration:none; }

.fl-notification-content {
	@extend .textTruncate;
  	@extend .fL;
	width:75%;
  	padding:1px 0px;
  	font-size:small;
  	@include bp(landscape1024) {
  		width:69%;
  	}
	@include bp(portrait768) {
  		width:59%;
  	}
  	@include bp(landscape568){
  		width:100%;
  	}
  	@include bp(portrait320) {
  		width:100%;
  	}  
}


.fl-notification-del-time {
	@extend .fR;
	@include bp(landscape568){
		float:left;
	}
}

.fl-status-and-type {
	@extend .fL;
	@include bp(landscape568){
		margin-bottom:10px;
	}
}

.fl-notification-wrapper-scroll {
	@extend .wH100perc;
	height: 363px;
	overflow: hidden;
	position: absolute;
	margin-left: -39px;
	@include bp(portrait768){
		width: 96.5%;
	}
	@include bp(portrait320){
		padding:0px!important;
		width:100%;
	}
}

.fl-notification-wrapper-scroll li {
	@include bp(landscape1024){
		width: 97.5%;
	}
}

.fl-starred-wrapper-scroll {
	@extend .wH100perc;
	height: 540px;
	overflow: hidden;
	position: absolute;
	font-size:small;
}

/*END NOTIFICATIONS CSS*/


/*ACCOUNT SETTINGS CSS*/

.fl-edit-profile-wrapper .two-columns {
	@extend .wH100perc;
	@extend .fL;
	@include bp(landscape1024) {
		
	}
	@include bp(portrait768) {
		
	}		
}
.fl-edit-profile-wrapper {
	margin-top:5px;
}


.fl-account-settings {
	position:relative;
	z-index:0;
}


/*tabs css*/

#tabs {
	@extend .Ht100perc;
    @extend .wH100perc;
    position: relative;
  	z-index:99999;
}

a {
	@extend .cursorPointer;
	color:#0096DD;
}

#tabs li {
    @extend .fL; 
    list-style:none; 
    border-top-left-radius:3px;  
    border-top-right-radius:3px;
    outline:none;
    @include bp(portrait768){
    	font-size:9px;
    }
      @include bp(portrait320){
    	font-size:13px;
    	width:100%;
    }

}


#tabs li a {
	@extend .colorfff;
	font-size:11px;
    padding:11px;
    display:block; 
    background: #FFF;
    text-decoration:none;
    outline:none;
    padding:10.5px;
    @include bp(landscape1024) {
    	padding:10.5px;
    }
     @include bp(portrait768) {
    	padding:10px;
    	font-size:12px;
    }
    @include bp(portrait320){
    	color:#ffffff;
    }
  
}

#tabs li a.inactive{
    color:#222;
   outline:none;
}

#tabs li a:hover, #tabs li a.inactive:hover {
      @extend .colorfff;
      outline:none; 
}	


.tab-container {
	@extend .taL;
	margin-top:10px;
    clear:both;           
    width:98%; 
	padding:10px;

}


.tab-container p { margin-left: 15px; margin-right: 15px;  margin-top: 10px; margin-bottom: 10px; line-height: 1.3; font-size: small; }

.tab-container ul { margin-left: 25px; font-size: small; line-height: 1.4;  }

.tab-container li { padding-bottom: 5px; margin-left: 5px;}

.fl-tab-wrapper {
	@extend .fR;
	position:relative;	
	@include bp(portrait320){
		right:0px!important;
		z-index:0;	
	}
}

/*tabs*/


.fl-fields {
	border-bottom: 1px solid #d6d6d6;
	position:relative;
	height:60px;
	line-height:40px;
	padding-top:20px;
}

.fl-fields:first-child {
	padding-top:0!important;
}

.fl-input_position {
	display:inline;

}

.fl-input_position input[type="button"] {
	@extend .cursorPointer;
}

.fl-input_position input[type="text"], input[type="password"] {
	@extend .fontFam;
	@extend .fR;
	width: 88%;
	height: 35px;
	font-size: $font-size;
	padding-left:5px;
	@include bp(landscape1024) {
		width:83%;
	}
	@include bp(portrait768) {
		width:575px;
	}
	@include bp(landscape568) {
		width:385px;
	}
	@include bp(portrait320) {
		width:145px;
	}
}

.fl-input_position input:focus { }

.eInfo_211 { display:none; }

.uInfo_211 {
	@extend .fR;
	width:87%;
	@include bp(landscape1024) {
		width:83%;
	}
	@include bp(portrait768) {
		width: 575px;
	}
	@include bp(landscape568) {
		width: 385px;
	}
	@include bp(portrait320) {
		width: 145px;
	}

}

.fl-personal_info {
	@include bp(landscape1024) {
		margin-left: 10px;
	}
}

/*END ACCOUNT SETTINGS CSS*/

.fl-starred-wrapper .fl-starred-color, .fl-custom-starred {
	color:#FFC200!important;
	position:static;
}

.fl-custom-starred { @include pos-rel(auto, auto, auto, -6px); }

.fl-from {
	@extend .colorfff;
	background-color: #08C200;
	font-size: 12px;
	padding: 5px;
	border-radius: 2px;
	margin: 0px 5px;
}

.fl-starred-wrapper .time, .fl-notification-wrapper .time {
	@include pos-rel(2px, 15px, auto, auto);
	@include bp(landscape568){
		right:0px;
		top:6px;	
	}	
}

.fl-notification-wrapper .fl-tab-wrapper {
	@extend .fN;
} 


/* FLFORM CSS*/

.fl-form-wrapper {
	@extend .wH100perc;
	background-color:#f4f4f4;
	height:500px; 
}


/* END FL FORM CSS*/

/* FL PROFILE CSS */

.fl-profile-wrapper h2 {
	padding: 14px;
	border-bottom: 1px solid #ccc;
	font-size:18px;
}
.fl-profile-wrapper .two-columns {
	width:75.2%;	
}

@include bp(landscape1024) {
	.fl-profile-wrapper .two-columns {
		width:100%;
	}
}

/* END FL PROFILE CSS */

#portal-app li {
	@extend .taC;
	display:inline-block;
	margin-right:20px;
	@include bp(portrait768){
		display:block;
		margin:0;
		margin-bottom:20px;
	}
}

@media screen and (-webkit-min-device-pixel-ratio:0) { 

    /* Safari only override */
    ::i-block-chrome, #portal-app li {
        float:left;
    }
    ::i-block-chrome, #portal-app {
    	 max-width:589px; 
    }

    ::i-block-chrome, .fl-admindashboard-icons-wrapper ul li {
    	width:215px !important;
    }
   	
}

//#inventoryportal-icon{ margin-right:0px!important; }

#hrportal-icon {
	background-image: url('/images/icon/hrportalicon.png');
	height:180px;
	width:180px;
	background-size: 100%;
	background-color:#ff8a00;
	border-radius: 100%;
	overflow:hidden;

}

#othersportal-icon {
	background-image: url('/images/icon/app-logo/othersportalicon.png');
	height:180px;
	width:180px;
	background-size: 100%;
	background-color:#6f6f6f;
	border-radius: 100%;
	overflow:hidden;

}

#acctportal-icon {
	background-image: url('/images/icon/acctportalicon.png');
	height:180px;
	width:180px;
	background-size: 100%;
	background-color:#5eafff;
	border-radius: 100%;
	overflow:hidden;
}

#inventoryportal-icon {
	background-image: url('/images/icon/inventoryportalicon.png');
	height:180px;
	width:180px;
	background-size: 100%;
	background-color:#00d100;
	border-radius: 100%;
	overflow:hidden;
}

.fl-app-name {
	margin-top:100px;
}


.fl-app-btn {
	@extend .colorfff;
	@extend .textTruncate;
	margin-top: 180px;
	background-color: rgba(22,22,22, .5);
	padding: 10px;
	line-height:25px;
}

.fl-app-btn a {
	@extend .colorfff;
	@extend .borderR3;
	@extend .boxSizingBB;
	background-color: #e13636;
	padding: 4px;
}



#imgContainer {
	@extend .wH100perc;
}

#positionButtonDiv {
	@extend .taL;
	@extend .colorfff;
	@include pos-abs(90px, 22px, auto, auto);	
	/* Fallback for web browsers that doesn't support RGBa */
	background: rgb(58, 56, 63);
	/* RGBa with 0.6 opacity */
	background: rgba(58, 56, 63, 0.8);
	border: solid 1px #100000;
	padding: 8px;
	z-index:99999;
}

#positionButtonDiv .positionButtonSpan img {
@extend .fR;
border: 0;
}

.positionMapClass area {
	@extend .cursorPointer;
}

.zoomButton {
	border: 0;
	@extend .cursorPointer;
}

.zoomableContainer {
background-image: url("/images/themes/workspace.jpg");
}


#pageContent {
	padding-left: 10px;
	padding-right: 10px;
	overflow: hidden;
}

.fl-copyright {
	@extend .taC;
	font-size:11px;
	margin-top:10px;
	line-height:18px;
	color:#6e6e6e;	
}

.fl-worspace-header {
	position: fixed; 
	top: 40px; 
	height:40px; 
	z-index:1; 
	left:0px; 
	background-color:#FAF8F8;
	border:none; 
	z-index:99999;
}



.fl-option-toolbar {

	.orgchart {
		background-position: -45px -448px;
	}

	.fl-create-forms-icon {
		background-position: -45px -712px;
	}

	.fl-workflow-icon {
		background-position: -45px -669px;
	}

	.reports {
		background-position: -45px -388px;
	}
		
	.messages {
		background-position: -42px -164px;
	}

	.notifications {
		background-position: -44px -196px;
	}

	.my-requests {
		background-position: -43px -232px;
	}

	.starred-icon-fl {
		background-position: -44px -264px;
	}

	.fl-groups-icon {
		background-position: -45px -634px;
	}

	.account-settings {
		background-position: -44px -329px;
	}

	.fl-keywords-icon {
		background-position: -47px -752px;
	}

	.fl-administer-icon {
		background-position: -46px -796px;
	}

	.modules {
		background-position: -42px -103px;
	}
}


.fl-toolbar-left-wrapper ul li{
	@extend .colorfff;
	@extend .boxSizingBB;
	display:inline-block;
	font-size:11px;
}

.fl-table-wrapper .fl-option-toolbar .fl-toolbar-left-wrapper ul li:hover{
	// @include pos-rel(2px, auto, auto, auto);
	// border:none;
}

.fl-table-wrapper .fl-option-toolbar .fl-toolbar-left-wrapper ul > li > a {
	@extend .colorfff;
	display:block;
	padding:9px;
}

.fl-toolbar-left-wrapper{ @extend .fL; }

.fl-toolbar-right-wrapper { @extend .fR; }

.fl-note-no-data-found { }

.fl-widget-wrapper-center-content {
	@extend .taC;
	min-width:200px;
	padding:5px;
	height:auto;
	font-size:12px;
	color:#e13636;
}

.fl-no-data-found {
	@extend .colorfff;
	background-color:rgba(#222, 0.5);
	padding:5px;
}

.fl-no-data-found i { @extend .colorfff; }

.fl-see-all {
	@extend .taC;
	background-color:$sidebar-color;
}

.fl-no-record-found {
	@extend .wH100perc;
	@extend .boxSizingBB;
	@extend .colorfff;
	padding:10px;
}

.fl-no-record-found h1 {
	@extend .taC;
	color:#E13636;
}

.fl-no-record-found i { color:#E13636!important; }


.fl-loading-content { @extend .taC; }

.fl-basicsecondary-btn   { @extend .fl-secondary-btn; }

.fl-for-saving-fitler {
	@extend .fR;
	display:inline;
	width: 200px;
	@include bp(portrait320){
		float: left;
		margin-top: 10px;
	}
}

.fl-basicprimary-btn {
	@extend .fl-primary-btn;
	@extend .taC;
	@extend .fL;
	@extend .cursorPointer;
	width: 65px;
	padding: 10px;
	margin-right:5px;
}

/* ALL ABOUT CALENDAR WIDGET */

.ui-widget-header { background:none; border:none !important; }

.ui-datepicker{
	@extend .fontFam;
	font-size: 12px!important;
	margin-top: 6px;
	padding: 12px!important;
}

#ui-datepicker-div { z-index: 1000000 !important; }

.ui_tpicker_hour, .ui_tpicker_time, .ui_tpicker_minute { margin: 8px 0px; }

.ui-datepicker-next-hover { }

.ui-state-hover { }

/* ALL ABOUT CALENDAR WIDGET */

/* ALL ABOUT POST*/
/*.post .text, .reply .text { border-radius:0px!important; }*/

.post { }

.fl-post-attribution {
	
	padding: 4px;
	box-sizing: border-box;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	margin-top: -3px;
}

.fl-post-attribution a, .fl-post-attribution a.fa {
	color:#ffffff;
}


// .reply:last-child{ border-bottom:0px; }

.timeline-messages:before { width:1px!important; }

.post-img { @extend .wH100perc }
/* ALL ABOUT POST*/

.spinner {
	@extend .taC;	
  	width: 100px;
  	height: 40px;
 	font-size: 10px;
	margin: 10px 0px;
}

.spinner > div {
  @extend .fL;
  margin-left:3px;
  height: 100%;
  width: 6px;
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .bar2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }

.spinner .bar3 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }

.spinner .bar4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }

.spinner .bar5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }

.spinner .bar6 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; }

.spinner .bar7 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; }

.spinner .bar8 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; }

.spinner .bar9 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; }

.spinner .bar10 { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; }

@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20%{ -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20%   { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}

#popup_container #popup_content #popup_panel button { margin-right:5px !important; }

#popup_container { @extend .fontFam; }

.post-privacy-container span  {
	@extend .fontFam;
	@extend .fontWeightN;
	line-height:20px;
}

.form-text { @extend .fontFam; }

.post-privacy{
	@extend .fL;
	@extend .fontWeightB;
    @extend .cursorPointer;
    width: auto;
    height: 19px;
    position: relative;
    margin-right: 10px;
    padding: 4px 5px 5px 5px;
    border: 1px ridge transparent;
    color : #A3A3A3 !important
}

.post-privacy:hover{
    border: 1px ridge rgba(170, 162, 162, 1);
    color : #615C5C !important
}

.post-privacy-active{
    border: 1px ridge rgba(170, 162, 162, 1) !important;
    color : #615C5C !important
}

.post-privacy-label-contaner{
    @extend .fL;
    @extend .wH100perc;
}

.post-privacy-arrow{
     @extend .fR;
    margin-top: -3px;
    color: rgb(120, 125, 180);
}

.postPrivacyChoice-container{
    @extend .bgcolorfff; 
    position: absolute;
    width:129px;
    height:auto;
    border:1px solid rgba(170, 162, 162, 1);
    margin-top:29px;
    z-index:1;
    display:none;
}

.postPrivacyChoice-choices{
    @extend .fontWeightB;
    @extend .cursorPointer;
    height: 20px;
    border-bottom: 1px dotted #CCC;
    width: auto;
    padding: 3px 5px 3px 10px;
    color: #666;
    font-size: 11px;
}

.postPrivacyChoice-choices:hover{ @extend .colorfff; }

.postChoice-icon{ @extend .fL; width:15px; }

.title_head_btn { @extend .fL; margin: 6px 4px; }

.avatar { 
	width:36px; 
	height:36px; 
}


/*** STRUCTURE ***/

/*  COLUMNS  */

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	@extend .fL;
	display: block;
	margin: 1% 0 1% 1.3%;
	@include bp(landscape1024) {
		margin:0;
	}
}


.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
                                               
/* WIDGET */
.fl-widget {	
	width: 32.4%;
	@include bp(landscape1024) {
		float:none;
		width:100%;
	}
}

/*  GRID OF TWO  */
.two-columns {
	@extend .wH100perc;
}
.two-columns {
	width: 48.2%;
}

/*  COLUMNS  */

#color1 {
	width: 10px;
	height: 10px;
	background-color: #E13636;
}

#color2 {
	width: 10px;
	height: 10px;
	background-color: #F5E31D;
}

#color3 {
	width: 10px;
	height: 10px;
	background-color:#DA36E1;
}

#color4 {
	width: 10px;
	height: 10px;
	background-color:#36a9e1;
}

#color5 {
	width: 10px;
	height: 10px;
	background-color:#E13688;
}


#color6 {
	width: 10px;
	height: 10px;
	background-color:#ff8a00;
}

#color7 {
	width: 10px;
	height: 10px;
	background-color:#04C204;
}


/* SPRITES CSS*/

.icon {
	@extend .fL;
	background-image: url('/images/icon/sprite.png');
	background-repeat: no-repeat;
	width: 35px;
	height: 30px;
}

.home {
	background-position: -42px 4px;
}

.mainmenu  li:hover .home {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -1px 4px;	
}	

.profile {
	background-position: -1px -30px;
}


.app-portal {
	
	background-position: -44px -64px;
}

.mainmenu  li:hover .app-portal {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -64px;
}	


.modules {
	background-position: -42px -97px;
}

.mainmenu  li:hover .modules {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -1px -97px;
}	


.Announcements {
	
	background-position: -43px -126px;
}

.mainmenu  li:hover .Announcements {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -2px -126px;
}	


.messages {
	
	background-position: -42px -160px;
}

.mainmenu  li:hover .messages {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -1px -160px;
}

.notifications {
	
	background-position: -44px -193px;
}

.mainmenu  li:hover .notifications {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -193px;
}


.my-requests {
	
	background-position: -43px -227px;
}

.mainmenu  li:hover .my-requests {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -2px -227px;
}	

.starred-icon-fl {
	
	background-position: -44px -259px;
}

.mainmenu  li:hover .starred-icon-fl {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -259px;	
}

.company-events {
	background-position: -2px -294px;
}

.account-settings {
	
	background-position: -44px -325px;
}

.mainmenu  li:hover .account-settings {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -325px;
}

.reports {
	
	background-position: -45px -383px;
}

.mainmenu  li:hover .reports {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -4px -383px;
}	


.file {
	background-position: -7px -381px;
}


.search  {
	@extend .fR;
	@include pos-rel(auto, 276px, auto, auto);
	background-position: -4px -359px;
	height: 25px;
	@include bp(portrait320){
		right:75px;
	}
} 
.fl-list-of-app-record-wrapper .fl-search-icon-list {
	@extend .cursorPointer;
	@include pos-rel(auto, -213px, auto, auto);
	width:36px;
	display:block;
}

.online-user  {
	background-position: -5px -417px;
}

.orgchart {	
	background-position: -44px -445px;
}

.mainmenu  li:hover .orgchart {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -445px;
}	 

.pinit {
	background-position:-40px -487px;
}

.unpinit {
	background-position:-3px -521px;
}

.fl-drag {
	background-position:-3px -555px;
}

.fl-suggestion-icon {
	
	background-position: -44px -592px;
}

.mainmenu  li:hover .fl-suggestion-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -3px -592px;
}


.fl-groups-icon {
	
	background-position: -45px -629px;
}

.mainmenu  li:hover .fl-groups-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position: -4px -629px;
}

.fl-widgets-icon {
	background-position: -48px -561px;
}

.fl-workflow-icon {
	
	background-position: -45px -667px;
}

.mainmenu  li:hover .fl-workflow-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position:-3px -667px;
}

.fl-create-forms-icon {
	
	background-position:-45px -709px;
}

.mainmenu  li:hover .fl-create-forms-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position:-3px -709px;
}

.fl-keywords-icon {
	background-position:-47px -748px;
}

.mainmenu li:hover .fl-keywords-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position:-4px -748px;
}

.fl-administer-icon {
	
	background-position:-46px -793px;
}

.mainmenu li:hover .fl-administer-icon {
	@extend .trans-duration3;
	@extend .trans-timing;
	background-position:-3px -793px;
} 

/* END SPRITES CSS*/

.page-loader-overlay{
	@extend .Ht100perc;
	@extend .wH100perc;
    display: table;
    position: fixed;
    background-color:rgba(0,0,0,0.9);
    z-index: 1001;
    }
    html .page-loader-overlay .align-middle{
  
    display: table-cell;
    vertical-align: middle;
    height:auto;
    }
    html .page-loader-overlay .loader-bar-container{
    position:relative;
    width:400px;
    height:30px;
    }
    
    html .page-loader-overlay .loader-bar-container .loader-filler{
   	@extend .Ht100perc;
    @extend .wH100perc;
    background-color:rgba(0,0,255,1);
    }
    html .page-loader-overlay .label{
    @extend .taC;
    @extend .Ht100perc;
    @extend .wH100perc;
    @include pos-abs(auto, auto, auto, auto);
    padding-top:5px;
    }
    html .page-loader-overlay .align-center{
    margin:0px auto;
    }
    html .page-loader-overlay .text-center{
    @extend .taC;
    }

    .fl-box-sizing {
    	@extend .boxSizingBB;
    	padding:10px;
    }


.fl-privacy-setting-wrapper .fl-table-wrapper table tr td {
	border: 1px solid #D6D6D6;
	background-color:#FAFAFA;
}

.fl-admindashboard-icons-wrapper {
	margin: 0 auto;
	margin-top:10px;
	ul {
		li {
			@extend .fL;
			@extend .trans-duration5;
			@extend .trans-timing;
 			@extend .textTruncate;
			width:215px; 
			height:116px;
			background-color:#F4F4F4;
			margin-right:5px;
			margin-top:5px;
		}		
	}
}

.fl-admindashboard-icons-wrapper ul li:hover { }

.fl-admindashboard-icons-wrapper ul li:nth-child(5) { margin-right:0px; }

.fl-admindashboard-icons-wrapper ul li:hover i { @include scale(1.2); }

.fl-admindashboard-icons-wrapper ul li:hover .fl-admin-icon-name { @extend .colorfff; }

.fl-admindashboard-icons-wrapper ul li i {
	@extend .taC;
	@extend .trans-duration2; 
	@extend .trans-timing;
	margin:10px;
	font-size:60px;
	color:#4d4949;
}

.fl-admindashboard-icons-wrapper ul { @include perspective(600); }

.fl-admin-icon-name {
	@extend .taC;
	@extend .textTruncate;
	@extend .trans-duration2; 
	@extend .trans-timing;
	font-size: 15px;
	color: #222;
	background-color: #d6d6d6;
	padding: 10px;
}


.fl-default-page-wrapper {
	@extend .borderR3;
	@extend .colorfff;
	padding: 8px 4px;
	font-size: 11px;
}

.fl-adminusersettings-wrapper .tab-container { @extend .wH100perc; padding:0; }

.fl-userlist-wrapper table tr td { padding:5px; }

.fl-userlist-wrapper table tr td input {
	@extend .wH100perc;
	padding:5px;
	box-shadow:none;
}

.fl-userlist-wrapper table tr td input[type="button"] { @extend .fN; }

/* TEMP TABLE FOR LIST OF ALL ADMIN ACTIONS */

.fl-list-of-app-record-wrapper table{ @extend .wH100perc; table-layout: fixed; }


.fl-list-of-app-record-wrapper table tbody tr th{
	@extend .fontWeightB;
	width:23%;
	background-color:#EDEDED; 
	padding:10px;
}

.fl-list-of-app-record-wrapper table tbody tr td { 
	@extend .boxSizingBB; 
	font-size:12px;
	word-break: break-word;
}

.fl-list-of-app-record-wrapper table tbody tr { border-bottom:1px solid #D6D6D6; height:45px; }

.fl-list-of-app-record-wrapper table tbody tr:first-child { border-top:1px solid #D6D6D6; }

.fl-list-of-app-record-wrapper table tbody tr td a i  {
	@extend .trans-duration2; 
	@extend .trans-timing;
	color:#cccccc;
}

.loadMsgList li div i, .group-container div div span i, .fl-filter-list tr td i, .fl-post-attribution a.fa {
	@extend .trans-duration2; 
	@extend .trans-timing;
}

.attribution a.fa {
	font-size:13px;
}

.fl-list-of-app-record-wrapper i.fa-pencil-square-o:hover, .fl-list-of-app-record-wrapper i.fa-globe:hover, .fl-list-of-app-record-wrapper i.fa-trash-o:hover, .fl-list-of-app-record-wrapper i.fa-file-text:hover, .table_data tr td center div:hover, .loadMsgList li div i:hover, .group-container div div span i:hover, .fl-filter-list tr td i:hover, .fl-post-attribution a.fa:hover{
	@include scale(1.3);

}

.fl-list-of-app-record-wrapper table tbody tr th:first-child{ width:70px; }

.fl-list-of-app-record-wrapper table tbody tr td a i {
	@extend .boxSizingBB;
	font-size:15px;
	padding: 2px 3px;
}

.fl-toolbar-right-wrapper ul.fl-breadcrums li { @extend .fL; padding: 0px 10px; }

ul.fl-breadcrums li {
	@extend .fL;
	background-color:#FAF8F8 !important;
	border:none!important;
	font-size: 13px;
	padding:7px;
}

/*	END TEMP TABLE FOR LIST OF ALL ADMIN ACTIONS */

/* ADMIN ALL WORKSPACE */


.fl-create-organization-chart-wrapper .contentBar_workspace, .fl-create-workflow-wrapper .contentBar_workspace, .fl-create-forms-wrapper .contentBar_workspace, .fl-create-reports-wrapper .contentBar_workspace, .fl-generate-print-wrapper .contentBar_workspace, .table_data th{
	border:none;
	background-color:transparent;
	background:transparent;
}

.table_data tr td center div, .table_data tr td center i {
	@extend .trans-duration2; 
	@extend .trans-timing;
	font-size: 15px;
}

.fl-create-organization-chart-wrapper .fl-option-toolbar .fl-toolbar-left-wrapper ul li:hover { position:static; }

.fl-workspace-wrapper { position:relative; }

.fl-workspace-wrapper .fl-option-toolbar  { line-height:32px; }

ul.fl-breadcrums li i {
	@include pos-rel(3px, auto, auto, 6px);
	font-size: 20px;	
}

.fl-workspace-wrapper .fl-toolbar-left-wrapper i { font-size:16px; }

ul.fl-breadcrums li a { color:#4E4E4E; }

ul.fl-breadcrums li .home { background-position: -38px -4px }

.fl-workspace {@extend .fL;  width:78%; }

.fl-form-properties-wrapper {
	@include pos-fix(70px, 0px, auto, auto);
	width:290px;
	background-color: #6e6e6e;
	z-index:99999;
}

.fl-form-properties-wrapper .fl-widget-head {
	border: 1px solid #d6d6d6;
	border-bottom: 2px solid #d6d6d6;
	height:25px;
	background-color:$sidebar-color;
	padding:5px;
}

.fl-form-properties-wrapper .fl-widget-head .widget-title { color:#222222 !important; }

.fl-props-container { max-height:600px; }

.fl-form-setting-wrapper, .fl-form-actions-wrapper, .fl-form-controls-wrapper, .fl-form-objects-wrapper, .fl-form-htmlvalue-wrapper {
	@include margin(10px, 10px, 0px, 10px);
}


.fl-form-setting-content,  .fl-form-actions-content, .fl-form-controls-content, .fl-form-objects-content, .fl-form-htmlvalue-content{
	@extend .wH100perc;
	@extend .bgcolorfff;
	@include margin(0px, 0px, 10px, 0px);
	@extend .boxSizingBB;
	height:132px;
	padding:10px;
	font-size:12px;
}

.fl-form-controls-content {
	margin: 0px;
}

.fl-generate-print-wrapper  .contentBar_workspace  .fl-form-properties-wrapper  .fl-form-setting-content, .fl-generate-print-wrapper  .contentBar_workspace  .fl-form-properties-wrapper .fl-form-actions-content,  .fl-generate-print-wrapper  .contentBar_workspace  .fl-form-properties-wrapper .fl-form-objects-content, .fl-generate-print-wrapper  .contentBar_workspace  .fl-form-properties-wrapper .fl-form-htmlvalue-content {
	height:86px;
}


.fl-min-max-properties i, .fl-min-max-properties2 i { @extend .fR; @extend .cursorPointer; } 

.fl-form-properties-toggle {
	@extend .boxSizingBB;
	@extend .cursorPointer;
	@include pos-rel(-20px, auto, auto, -6px);
	height: 37px;
	width: 33px;
	background-color: #3A4B55;
	padding: 11px;	
	z-index:-1;
}

.fl-form-properties-toggle i { @extend .colorfff; font-size: 18px; }

.fl-form-setting-content  {@extend .fontWeightB;  font-size:11px; }

.fl-form-setting-content input[type="text"]{
	@extend .boxSizingBB;
	padding:5px;
	width:49%;
}

.fl-option-form-wrapper{ 
	@include margin(8px, 0px, 8px, 0px);
 }

.fl-option-form-wrapper > .form-select{ }

.fl-command-btn {
	@extend .colorfff;
	@extend .borderR3;
	width: 49%;
	font-size: 13px;
	padding: 5px;
	border:none;
	margin-bottom:3px;
}

.fl-command-btn i { @extend .colorfff; }

.fl-for-scroll { overflow:hidden; position: relative; }

.fl-workspace .fl-add-parameter-btn {
	@include margin(10px, auto, 10px, auto);
	float: left !important;
	width: 105px !important;
}

/* END ADMIN ALL WORKSPACE */

.label_below2 { 
	@include margin(10px, auto, 10px, auto);
	@extend .fontWeightB;
	letter-spacing:1px;
	font-size:12px; 
	color: #4E4E4E;
}

table.fl-form_category-table tbody tr th:first-child, table.fl-form_category-table tbody tr td:first-child, table.fl-suggestions-table tbody tr th:first-child, table.fl-suggestions-table tbody tr td:first-child {
	@extend .taC;
	width:5px;
}

.fl-word-break { word-wrap: break-word; }

.dataTable thead tr th, .dataTable tbody tr td{
	 //remove background:transparent !important because of conflict in plotband
	 @extend .fontFam;
	 font-size:12px;
}

.node-settings-wrapper, .border-circle-node { padding-top:2px !important; @extend .boxSizingBB; }

span.node-drag-text-wrapper, .node-circle-dragtopoint-wrapper {
	@extend .textTruncate;
	font-size:14px !important;
}

span.node-drag-text-wrapper:before { top:0px !important; }

.node-drag-item-wrapper {
	width:20px !important;
	height:20px !important;
	margin:0px !important;
}

.node-circle-title { @include border-top-right-radius(8px); }

.node-holder-avatar-wrapper { width: 40px !important; height: 40px !important; }

.node-avatar-wrapper { width: 36px !important; height: 36px !important; }

/** ALL ABOUT ACCORDION **/
/*#accordion-container >*/ .ui-widget-header {
	background:#6e6e6e !important;
	border-radius:0px !important;
	border:none;
}

/*#accordion-container >*/ ul li.ui-corner-top { border-radius:0px !important; }
/*.content-dialog-container > #accordion-container >*/ ul li.ui-state-active {
	border: 1px solid #A81E1E;
	background:#ffffff  !important;
	padding-bottom: 0px;
}

ul.ui-widget-header {
	li.ui-state-active {
		background-color:#ffffff !important;
	}
}


.content-dialog-container > #accordion-container > ul li.ui-state-default {
	border:0px;
	background:#29353C;
}
.content-dialog-container > #accordion-container > ul li.ui-state-default a {
	color:#222222;
}
/*.content-dialog-container > #accordion-container >*/ ul li.ui-state-active a {
	color:#222222 !important;
}

 #accordion-container { @include margin(10px, 15px, 10px, 15px); }

.ui-state-default, .ui-widget-content .ui-state-default{ background:#ECECEC !important; }
.ui-widget-content { background: #ffffff !important; }

.ui-state-active, .ui-widget-content .ui-state-active {@extend .fontWeightN; border:none !important;}


.ui-state-active a, .ui-state-active a {color:#222222 !important;
}
.ui-state-default a, .ui-state-default a { @extend .fontWeightN; color:#222222 !important;}

li.ui-state-hover { border-color:#ececec !important; }

/*#accordion-container*/ .ui-tabs-nav .ui-tabs-active { background:#ffffff !important; }

.content-dialog-container { width:100% !important; }

/** ALL ABOUT ACCORDION **/


/*OLD FORM INPUTS*/
.form-textarea  {
	border: 1px solid #D5D5D5 !important;
}
/*OLD FORM INPUTS*/

#loadSuggestion_wrapper table tr td{
	line-height:20px;
}

.fl-edituser {
	@extend .wH100perc;
	padding: 5px;
	box-shadow: none !important;
}

ul.ui-autocomplete {
	z-index:9;
	margin-top: 14px;
	width:141px !important;
	background-color:#E6E6E6 !important;
}



ul.ui-autocomplete li a.ui-state-focus {
	@extend .boxSizingBB;
	@extend .colorfff;
	border:none !important;
	padding:5px;
}

ul.ui-autocomplete li a { display:block !important; padding:5px; }

ul.ui-widget-content { border:none !important; }

.fl-widgets-wrapper { min-height:448px; margin-top:10px; }

.fl-padding-bottom { padding-bottom:5px; }

.fl-options-data-type { width:33px; }

.container-formUser { margin-bottom:10px; }

.font-bold { @extend .fontWeightB; @extend .cursorPointer; }

.fl-form-prop-cont-wid { width:49%; }

.fl-floatLeft { @extend .fL; }

.fl-floatRight { @extend .fR; }

.fl-suggestion-input  {
	width:97%;
	border: 1px solid #D5D5D5 !important;
	padding: 7px;
	font-size: 11px;
}

.fl-add-param .table_data .fl-header-tbl-wrapper { border: 1px solid #D4D4D4; }

.fl-input-file { margin-left: -44px; margin-top: -17px; }

//version modal2 

.fl-closeDialog {
	@extend .boxSizingBB;
	@extend .trans-duration2; 
	@extend .trans-timing;
	@extend .taC;
	@extend .cursorPointer;
	@include pos-abs(-18px, -20px, auto, auto);
	//background: rgba(0, 0, 0, 0.3)!important;
	border: 3px solid rgba(0, 0, 0, 0.3);
	z-index: 1;
	border-radius:100%;
	width:31px;
	height:31px;
	padding-top:4px;
	&:hover {
		background:#2C3A42!important;
	}

	& i.fa {
		@extend .colorfff;
		font-size: 16px;
	}

	
}

.fl-dialogHeader {
	@extend .colorfff;
	line-height: 30px;
	padding:5px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;

	div {
		h3 {
			i.fa {
				@extend .colorfff;
			}
		}
	}

	h3 {
			i.fa {
				@extend .colorfff;
			}
		}
}

.content-dialog {
	@extend .boxSizingBB;
	padding:0px 15px 15px 15px;
	height:auto;
	margin-bottom:100px;
}

.fl-footDialog {
	@extend .wH100perc;
	@extend .boxSizingBB;
	height: 53px;
	padding: 10px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;

}



input[type="button"].fl-buttonEffect, .fl-buttonEffect {
	@extend .borderR3;
	@extend .trans-duration2; 
	@extend .trans-timing;
	@extend .fl-button-press;

	&:hover {
	@extend .fl-button-press-hover;	
	}
}

.form-select, input[class^="form-"], input[class*="form-"],  .form-textarea, .form-selectMany, .input-select, .form-text, .fl-suggestion-input, .suggestion-message, .fl-edituser {
    @extend .trans-duration5;
	@extend .trans-timing;
    @extend .borderR3;
    letter-spacing: 2px;
    background-color:#fafafa !important;
}

.form-select:focus, input[class^="form-"]:focus, input[class*="form-"]:focus,  .form-textarea:focus, .form-selectMany:focus, .input-select:focus, .form-text:focus, .fl-suggestion-input:focus, .suggestion-message:focus, .fl-edituser:focus {		
	-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3) !important;
	-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3) !important;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

#content-dialog-scroll,.content-dialog-scroll-unique {
	@extend .wH100perc;
	position: relative;
	margin: 0px auto;
	padding: 0px;
	height: 317px;
	overflow: hidden;
}

.faiconColor { @extend .colorfff; }

.icon-remove { @extend .cursorPointer; }

// .fl-filter-list { width:100px !important; }

.fl-filter-list tbody tr td .fl-table-ellip {
	margin-left:0px;
	margin:5px 0px;
	width:342px;
	
}

.fl-filter-list tbody tr {
	border-bottom: 1px solid #222;
}

.fl-filter-list tbody {
	margin-bottom:5px;
}

.fl-filter-list tr:nth-child(even) {
	background-color:#D6D6D6;
}

.fl-modal2 .mentionSelectedContainer{
	width:90% !important;
	margin: 0 auto !important;
	margin-top: 10px !important;
}
.fl-modal2 textarea.input-announcement { margin-left: 20px !important; }

#logs-container { @extend .boxSizingBB; padding:10px !important;}

.fl-modal2 #post-privacy-container { margin-top:10px !important; }

.tada {
	@include wobble($duration: $durationDefault, $delay: $delayDefault, $function: $functionDefault, $fill: $fillDefault, $visibility: $visibilityDefault);
}

.bounceInUp {
	@include bounceInUp();
}

.bounceOutUp {
	@include bounceOutUp();
}


.bounceIn {
	@include bounceIn();
}

.bounceOut {
	@include bounceOut();
}

.bounceInRight {
	@include bounceInRight();
}

.bounceInLeft {
	@include bounceInLeft();
}


.fadeIn {
	@include fadeIn();
}

.fadeInRight {
	@include fadeInRight();
}

.fadeOutRight {
	@include fadeOutRight();
}

.fadeInUp {
	@include fadeInUp();
}

.fadeOutUp {
	@include fadeOutUp();
}

.fadeInLeft {
	@include fadeInLeft();
}

.fl-createViewreq {
	@extend .fL;
	@extend .cursorPointer;
	//background-color:#6e6e6e !important;
	@include margin(0px, 10px, 0px, 5px);
	width: 10px;
	padding: 3px 10px; 
	i {
		@extend .colorfff;	
	}
}

.fl-addcom-addfile-wrapper {
	.fa {
		@extend .colorfff;
	}
}

#textarea-popup-comment textarea.comment-popup {
	width:90% !important;
}

#comment-container .requestComment {
	margin-top:10px;
}

.formbuilder_page_btn  .btn-basicBtn {
	width:auto;
}

.jqueryHashtags .highlighter {
	@extend .fontFam;
}


//checkbox design UI

input[type=checkbox].css-checkbox {
	display:none;
}

input[type=checkbox].css-checkbox + label.css-label {
	@extend .trans-duration3;
  	@extend .trans-timing;
	padding-left:17px;
	height:15px; 
	display:inline-block;
	line-height:15px;
	background-repeat:no-repeat;
	background-position: 0px -15px;
	font-size:20px;
	vertical-align:middle;
	cursor:pointer;
}

input[type=checkbox].css-checkbox:checked + label.css-label {
	@extend .trans-duration3;
  	@extend .trans-timing;
	background-position: 0 0;
}

label.css-label {
background-image:url(/css/images/checkbox.png);
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

// end of checkbox design UI

//RADIO UI design

input[type=radio].css-checkbox {
// position:absolute; z-index:-1000; top:-1000px;
display:none;
}

input[type=radio].css-checkbox + label.css-label, input[type=radio].css-checkbox + label.css-label.clr {
padding-left:17px;
height:15px; 
display:inline-block;
line-height:15px;
background-repeat:no-repeat;
background-position: -17px -15px;
font-size:20px;
vertical-align:middle;
cursor:pointer;

}


input[type=radio].css-checkbox:checked + label.css-label, input[type=radio].css-checkbox + label.css-label.chk {
background-position: -17px 0px;
}
label.css-label {
background-image:url(/css/images/checkbox.png);
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

// end of RADIO UI design




#loadFormRecords_wrapper table tbody tr td:not(:first-child), #loadMyRequestTable tbody tr td{
  cursor: pointer !important;
}
